import { useSelector, useDispatch } from "react-redux";
import {
  decrement,
  increment,
  incrementByAmount,
  emptyCount,
} from "@/store/features/couterSlice";
import { setInfo, remove } from "@/store/features/user";
import { Button } from "antd";

function DefaultPage() {
  const count = useSelector((state: any) => state?.counter.value);
  const userInfo = useSelector((state: any) => state?.user);
  const dispatch = useDispatch();

  return (
    <>
      <div>
        <div>
          <Button
            className="mr-4"
            onClick={() => dispatch(emptyCount(0))}
            type="primary"
          >
            清零
          </Button>
          <Button type="primary" onClick={() => dispatch(increment())}>
            increment增加
          </Button>
          <div className="mt-2 mb-2">{count}</div>
          <Button
            type="primary"
            className="mr-4"
            onClick={() => dispatch(decrement())}
          >
            Decrement减少
          </Button>
          <Button
            type="primary"
            onClick={() => dispatch(incrementByAmount(count > 0 ? count : 1))}
          >
            增加指定值
          </Button>
          <div className="mb-4 outline-dotted-red-600">
            {userInfo?.username ?? "默认"}
          </div>
        </div>
      </div>
    </>
  );
}

export default DefaultPage;
